import { getCurrentTime } from "@/common/common";
import { RouterButton } from "@/components/RouterButton";
import Link from "next/link";
import { useState,useEffect } from "react"


export default function Page(props:any) {

  return (
   <main>
      <h1>User List Page</h1>
      <h4>{props.dt}</h4>
      <RouterButton />
      <ul>
        {props.data.map((item:any,index:number)=>
          <li key={index}>
            <h4><Link href={`/user/${item.id}`}>{item.firstName} {item.lastName}</Link></h4>
          </li>
        )}
      </ul>
   </main>
  )
}


//构建过程动态获取数据 生成静态数据
//在dev环境下,每次刷新都相当于重新build  => pnpm dev
//在build环境下,只会build一次          => pnpm build => pnpm start
export async function getStaticProps() {
    const dt = getCurrentTime();
    const response = await fetch('https://dummyjson.com/users');
    
    const {users:data} = await response.json();

    return ({
      props: {
         dt,
         data
      },
      revalidate: 10  //每隔10秒会重新构建,只有fallback = false 才生效
    })
}